html, body { margin: 0; padding: 0; }

body {
  -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
}

.w800, .w600, .w400, .w300 {
  margin-left: auto;
  margin-right: auto;
}
.w800 { max-width: 800px; }
.w600 { max-width: 600px; }
.w400 { max-width: 400px; }
.w300 { max-width: 300px; }

.bold { font-weight: bold; }
.center { text-align: center; }
.float-left { float: left; }
.float-right { float: right; }

.gray { color: gray; }
.no-select, .gray, .btn, .dropdown, .alert {
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none; }
.no-border { border: none; }
.no-pointer, .disabled a { pointer-events: none; }

a { text-decoration: none !important; }
[onclick], li:not(.disabled)>a, .note-row-head, .note-row-end { cursor: pointer; }

input, .btn, input:focus, .btn:focus { outline: none; }
input[type="submit"] { border: none; }
.input-group + .input-group { margin-top: 8px; }

.bx-shadow {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
     -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}
.btn-key {
    display: inline-block;
    box-shadow: var(--key-shadow);
    background: var(--key-gradient);
    border: 0; border-radius: 3px;
    margin-right: .4em;
    position: relative; top: -1px;
    min-width: 20px; padding: 1px 2px;
    font-size: 12px; font-family: monospace;
}

@media print {
  .no-print, nav, footer, .sidebar {
    display: none;
  }
}

.p-0 { padding: 0 !important; }
.p-10 { padding: 10px !important; }
.p-20 { padding: 20px !important; }

.m-0 { margin: 0 !important; }
.m-5 { margin: 5px !important; }
.m-10 { margin: 10px !important; }
.m-20 { margin: 20px !important; }

.m-t-0 { margin-top: 0 !important; }
.m-t-5 { margin-top: 5px !important; }
.m-t-10 { margin-top: 10px !important; }
.m-t-15 { margin-top: 15px !important; }
.m-t-20 { margin-top: 20px !important; }
.m-t-n5 { margin-top: -5px !important; }
.m-t-n10 { margin-top: -10px !important; }
.m-t-n20 { margin-top: -20px !important; }

.m-b-0 { margin-bottom: 0 !important; }
.m-b-5 { margin-bottom: 5px !important; }
.m-b-10 { margin-bottom: 10px !important; }
.m-b-15 { margin-bottom: 15px !important; }
.m-b-20 { margin-bottom: 20px !important; }

.m-l-0 { margin-left: 0 !important; }
.m-l-5 { margin-left: 5px !important; }
.m-l-10 { margin-left: 10px !important; }
.m-l-15 { margin-left: 15px !important; }
.m-r-0 { margin-right: 0 !important; }
.m-r-5 { margin-right: 5px !important; }
.m-r-10 { margin-right: 10px !important; }

.modal-body h4 { font-size: 16px; font-weight: 400; white-space: nowrap; }
.modal-body input + label { margin-right: 8px; }
.modal-body .modal-radio { margin-top: 6px; margin-bottom: 6px; }
.modal-body .modal-radio label { font-weight: normal; }
.control-label.required::after {
    content: "*"; color: gray;
    margin-left: .5em;
}
.wait { cursor: wait; }
.wait button { pointer-events: none; }
.swal2-modal { font-size: 14px; }

.panel-heading > div.panel-title { line-height: 1.1; }
.panel-body p:last-child { margin-bottom: 0; }
.info-span { margin-right: 15px; display: inline-block; white-space: nowrap; }
.panel-title .dropdown.pull-right { margin-top: -6px; margin-right: -10px; }
.panel-title .btn { border: none; }

.app-main { margin-top: 10px; }
.table-p { max-width: 100%; overflow-x: auto; }
th { min-width: 3em; }
th.created_by { min-width: 4em; }
.table-p > table { border-collapse: separate; }
.table-p > table.single-article { width: 100%; }
.app .table > tbody > tr > td { max-width: 9em; }
.app .table > tbody > tr > td.code,
.app .table > tbody > tr > td.created_by { max-width: 5.5em; }
li.name>a { max-width: 10em; }
.ellipsis, td.code, td.created_by, li.name>a {
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.app td p:last-child { margin-bottom: 0; }
td.created_at, td.updated_at { font-size: .9em; min-width: 5em; }
.table .name, .table .base { min-width: 5em; }
.table .actions { text-align: center; }
.table .actions .btn { padding: 2px 5px; margin-bottom: 2px; }
.users > span + span { margin-left: 5px; }

.ellipsis-n, td.name > div, td.base > div, td.comment > div {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.table td > div { -webkit-line-clamp: 2; }

p.text { text-indent: 2em; }
.text.xu { font-size: .9em; }
.text.xu.head { text-align: center; text-indent: 0; }
.text.xu_first {
    border-top: 1px solid var(--border-color);
    margin-top: .5em; padding-top: .5em;
}
.text.xu_end:not(:last-child) {
    border-bottom: 1px solid var(--border-color);
    margin-bottom: .5em;
}
.text.xu_end:not(.ellipsis-n) { padding-bottom: .5em; }
.xu_end + .text.xu_first,
.num + .text.xu_first,
.text.xu_first:first-child, .no-select + .text.xu_first { border-top: none; padding-top: 0; }

.text.start-quot, .text.start-quot { text-indent: 1em; }
.text.juan_end { text-align: right; font-size: .7em; text-indent: 0; }
.text.byline { text-align: right; text-indent: 0; font-size: .8em; }
.text.juan { font-size: 1.05em; font-weight: bold; text-align: center; text-indent: 0; }
.text.juan.xu { font-size: 1em; }
.text.juan small { font-weight: normal; }
.text.head, .text.toc_line, .text.pin { font-weight: 500;
    font-family: STKaiti,"Kaiti SC","楷体","楷体_GB2312",KaiTi,KaiTi_GB2312,DFKai-SB,sans-serif; }
.text.num { font-size: .8em; }
.text.verse, .text.dharani { color: var(--verse-color); }
@media (min-width:600px) {
    .text.verse { margin-left: 2em; }
}

.note-tag::before { content: "〔" attr(data-tag) "〕"; font-weight: bold; color: var(--hover-color); }
.note-tag[data-pn]::before { content: "〔" attr(data-pn) "〕"; }
.note-tag.expanded.active-note::before { color: var(--selected-color); }
.note-tag.inline.expanded { padding: .4em .2em; margin-left: .2em; top: unset; font-size: 90%; font-weight: 400; }
.note-tag.inline.expanded::before { display: none; }
.note-tag.inline.expanded::after { content: "〔" attr(data-text) "〕"; }
.note-tag.after { margin-left: -1em; }

.note-text, .note-tag.inline.expanded::after {
    color: var(--note-text-color);
    font-family: STKaiti, "Kaiti SC", 楷体, 楷体_GB2312, KaiTi, KaiTi_GB2312, DFKai-SB,sans-serif;
}
.text .hi { color: var(--note-text-color); padding: .3em 0; }
.cell-l .text span.hi { text-decoration: underline; text-decoration-color: var(--placeholder-color); }

.note-p {
  border: 1px solid var(--border-color);
  border-radius: 4px;
  padding: .5em;
  margin-bottom: 6px;
  text-indent: 0;
  font-size: .9em;
  -moz-box-shadow: 1px 1px 1px var(--border-color);
       box-shadow: 1px 1px 1px var(--border-color);
       transition: background-color 200ms ease-out,display 200ms ease-out;
}
.note-p:not(.expanded) { display: none; }
@media print {
  .note-p {padding: .2em;}
}

.note-row-head[data-pn]::before { content: "〔" attr(data-pn) "〕"; color: gray; }
.note-row-end[data-tag]::after { content: "〔" attr(data-tag) "〕"; color: gray; }
.note-row-head[data-pn].active-note::before { color: var(--selected-color); font-weight: bold; }

.note-pn + .note-pn { border-top: 1px solid var(--border-color); }
.note-item + .note-item { border-top: 1px dotted var(--border-color); }
.note-text.ellipsis-n { -webkit-line-clamp: 2; }
.note-text.ellipsis-n:nth-child(n+5) { display: none; }

.note-p > .close { float: right; margin-top: -24px; margin-right: -8px; font-size: 15px; }
.note-p > .close::after { content: "✕"}
